<script>
export default {
  name: 'bianLi',
  data() {
    return {
      list: [1, 2, 3, 4, 5, 6],
      num: 10,
      obj:{
        name:'小明',
        age:18,
        sex:'男'
      },
      flag:true,
      list1:[{id:0,title:'title1'},{id:1,title:'title2'},{id:2,title:'title2'}],
      class1:'box',
      listObj: [
        {
          id: 0,
          titele: "day01-java介绍、环境搭建、变量",
          settion: [
            {
              id: 0,
              sectionName: "01安装jdk"
            },
            {
              id: 1,
              sectionName: "02安装jdk"
            }, {
              id: 2,
              sectionName: "03安装jdk"
            }
          ]

        },
        {
          id: 1, titele: "day02-java介绍、环境搭建、变量",
          settion: [
            {
              id: 0,
              sectionName: "01安装jdk"
            },
            {
              id: 1,
              sectionName: "02安装jdk"
            }, {
              id: 2,
              sectionName: "03安装jdk"
            }
          ]
        },
        {
          id: 2, titele: "day03-java介绍、环境搭建、变量",
          settion: [
            {
              id: 0,
              sectionName: "01安装jdk"
            },
            {
              id: 1,
              sectionName: "02安装jdk"
            }, {
              id: 2,
              sectionName: "03安装jdk"
            }
          ]
        },
      ]
    }

  }
}
</script>

<template>
  <div>
    <!--  1.遍历数字-->
    <!--  <div v-for="num in 10" :key="num">-->
    <!--    {{num}}-->
    <!--  </div>-->
    <!--  2.遍历数组-->
<!--    <div v-for="(item,index) in list" :key="index">-->
<!--      {{item}}-->
<!--    </div>-->
<!--    3.遍历对象-->
<!--        <div v-for="(item,index) in obj" :key="index">-->
<!--          {{item}}-->
<!--        </div>-->
<!--            <div v-for="(item,index) in list1" :key="index" :class="class1">-->
<!--              {{item.title}}-->
<!--            </div>-->
<!--    获取课程列表-->
<!-- <div v-for="(item,index) in list1" :key="item.id">-->
<!--   {{item.title}}-->
<!--   <div v-for="(item1,index1) in listObj" :key='index1'>-->
<!--     {{index+1}}-{{index1+1}}{{item1.titele}}-->
<!--   </div>-->
<!-- </div>-->
<!--    v-if  v-show-->
    <div :class="class1" v-if="flag">111</div>
    <div :class="class1" v-show="flag">111</div>

  </div>
</template>

<style scoped lang="less">
.box {
 width: 100px;
  height: 100px;
  background-color: red;
}
</style>